/**
 * 生成问题-进度条
 */
import React, { Component } from "react";
import { connect } from "dva";
import { routerRedux } from "dva/router";
import { Card, Button, Modal, Progress } from "antd";
import styles from './knowledgeGather.less';
import { getGenerateQuestionsRadio, cancelKnowledgeCollect } from '@/services/knowledgeGather';

let timer;
class GenerateQuestion extends Component {
	constructor(props) {
		super(props);
		this.state = {
			progress: 0,
			cancelLoading: false,
		};
	}

	componentDidMount() {
		this.setState({ process: 0 });
		this.getStatusRadio();
	}

	componentWillUnmount() {
		if (timer) clearTimeout(timer);
		this.setState({ process: 0 });
	}

	getStatusRadio = async () => {
		clearTimeout(timer);
		let res = await getGenerateQuestionsRadio();
		console.log(res);
		if (res.code === 0) {
			this.setState({ progress: res.data });
			if (res.data >= 0 && res.data < 100) {
				timer = setTimeout(() => {
					this.getStatusRadio();
				}, 1500)
			} else if (res.data == 100) {
				timer = setTimeout(() => {
					this.nextRouter()
				}, 1500)
			}
		}
	}

	nextRouter = () => {
		const { dispatch } = this.props;
		let pathname = "/knowledgeDesign/knowledgeCollect/questionLibrary";
		dispatch(routerRedux.push({ pathname }));
	}

	render() {
		const { progress, cancelLoading } = this.state;

		return (
			<div className={styles['generate-question']}>
				<Card bordered={false}>
					<div className={styles.title}>正在切片并生成问题</div>
					<div style={{ margin: '0 120px', marginBottom: 80 }}>
						<Progress type="line" percent={progress} strokeColor="#6682ff" onClick={this.nextRouter} />
					</div>
					<div style={{ textAlign: 'center', marginBottom: 20 }}>
						<Button type="primary" style={{ width: '120px' }} loading={cancelLoading} onClick={this.backRouter}>取消采编</Button>
					</div>
				</Card>
			</div>
		);
	}

	backRouter = () => {
		Modal.confirm({
			title: '确定取消当前文档的采编',
			okText: '确定',
			okType: 'danger',
			cancelText: '取消',
			onOk: async () => {
				if (timer) clearTimeout(timer);
				this.setState({ cancelLoading: true })
				let res = await cancelKnowledgeCollect();
				console.log(res);
				if (res.code === 0) {
					this.setState({ cancelLoading: false })
					const { dispatch } = this.props;
					let pathname = "/knowledgeDesign/knowledgeCollect";
					dispatch(routerRedux.push({ pathname }));
				} else {
					this.setState({ cancelLoading: false })
				}
			},
			onCancel() {
				console.log('取消操作！！！');
			},
		});
	}
}

export default connect(({ user }) => ({
	currentUser: user.currentUser,
}))(GenerateQuestion);
